<html>
	<head>
		<meta charset="utf-8" >
		<title>打地鼠</title>
		<style>
			#container{
				width:1200px;
				height:1100px;
				border:2px solid darkgreen;
				margin:0 auto;
			}
			#container div{
				width:550px;
				height:413px;
				background:url("well.png");
				float:left;
			}
			#container #well1{
				background:url("out.gif");
			}
			#cursorPic{
				width:449px;
				height:368px;
				background:url("chuizi.png");
				position:absolute;
				x:500px;
				y:600px;
			}
		</style>
	</head>

<body>
	<div id="point-loc"></div>
	<div id="cursorPic"></div>
	<div id="container">
		<div id="well1"></div>
		<div id="well2"></div>
		<div id="well3"></div>
		<div id="well4"></div>
	</dtoplay"controls="controls"><////
	<script type="text/javascript">	
	var cursorPic = document.getElementById("cursorPic");
	document.onmousemove = function(e){
		var loc = "当前位置 x:"+e.pageX+",y:"+e.pageY
		document.getElementById("point-loc").innerHTML = loc;
		cursorPic.style.left=e.pageX-220+"px";
		cursorPic.style.top=e.pageY-180+"px";
	}
    document.onmouseup = function(e){
        cursorPic.style.backgroundImage = "url('chuizidown.png')";	
	}
	document.onmousedown = function(e){
		cursorPic.style.backgroundImage = "url('chuizidown.png')";	
	}
	</script>
	</body>
</html>
